<!doctype html>
<html lang="zh">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1.0">
		<title>登录</title>

		<link rel="stylesheet" type="text/css" href="css/normalize.css" />
		<link rel="stylesheet" type="text/css" href="css/default.css">
		<link rel="stylesheet" type="text/css" href="css/global-z.css" media="all" />
		<link rel="stylesheet" type="text/css" href="css/login-z.css" media="all" />

		<!--[if IE]>
		<script src="http://libs.useso.com/js/html5shiv/3.7/html5shiv.min.js"></script>
	<![endif]-->
	</head>
	<body>

		<svg id="svg-source" height="0" version="1.1" viewBox="0 0 1024 1024" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"
		 style="position: absolute">
			<g id="shopping-cart" data-iconmelon="e-commerce icons:7c96e2dece0152dc594d66b260f79db0">
				<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
					<path d="M947.2 921.6l-563.2 0c-42.3424 0-76.8-34.4576-76.8-76.8 0-2.4576 0.5632-60.928 47.3088-118.528 26.88-33.0752 63.5392-59.2896 108.9536-77.9264 54.8352-22.528 122.88-33.8944 202.1376-33.8944s147.2512 11.4176 202.1376 33.8944c45.4144 18.6368 82.0736 44.8512 108.9536 77.9264 46.7968 57.6 47.3088 116.0704 47.3088 118.528 0 42.3424-34.4576 76.8-76.8 76.8zM358.4 844.9536c0.0512 14.08 11.52 25.4464 25.6 25.4464l563.2 0c14.08 0 25.5488-11.4176 25.6-25.4464-0.0512-1.792-1.6384-45.824-37.8368-88.7808-49.8688-59.2384-143.0016-90.5216-269.3632-90.5216s-219.4944 31.3344-269.3632 90.5216c-36.1984 43.008-37.7856 86.9888-37.8368 88.7808z"
					 p-id="3811"></path>
					<path d="M665.6 563.2c-112.9472 0-204.8-91.8528-204.8-204.8s91.8528-204.8 204.8-204.8 204.8 91.8528 204.8 204.8c0 112.9472-91.8528 204.8-204.8 204.8zM665.6 204.8c-84.6848 0-153.6 68.9152-153.6 153.6s68.9152 153.6 153.6 153.6 153.6-68.9152 153.6-153.6-68.9152-153.6-153.6-153.6z"
					 p-id="3812"></path>
					<path d="M230.4 921.6l-153.6 0c-42.3424 0-76.8-34.4576-76.8-76.8 0-1.8944 0.4096-47.4624 33.9456-92.16 19.3536-25.856 45.7728-46.2848 78.4896-60.8256 39.1168-17.408 87.4496-26.2144 143.616-26.2144 9.1648 0 18.2272 0.256 26.9824 0.7168 14.1312 0.768 24.9344 12.8 24.2176 26.9312s-12.8 24.9856-26.9312 24.2176c-7.8336-0.4096-15.9744-0.6144-24.2176-0.6144-199.3728 0-204.6464 121.8048-204.8 128.1536 0.0512 14.0288 11.52 25.4464 25.6 25.4464l153.6 0c14.1312 0 25.6 11.4688 25.6 25.6s-11.4688 25.6-25.6 25.6z"
					 p-id="3813"></path>
					<path d="M256 614.4c-84.6848 0-153.6-68.9152-153.6-153.6s68.9152-153.6 153.6-153.6 153.6 68.9152 153.6 153.6-68.9152 153.6-153.6 153.6zM256 358.4c-56.4736 0-102.4 45.9264-102.4 102.4s45.9264 102.4 102.4 102.4 102.4-45.9264 102.4-102.4c0-56.4736-45.9264-102.4-102.4-102.4z"
					 p-id="3814"></path>
				</svg>
			</g>
			<g id="credit-card" data-iconmelon="e-commerce icons:c3144b166f93e0f6b73aee04a0a48397">
				<svg viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
					<path d="M758.6816 290.816h-47.7696V0.256H313.9584V290.816h-47.7696c-47.4624 0-86.016 42.4448-86.016 94.72v542.9248c0 52.3264 38.5536 94.72 86.016 94.72h492.4928c47.4624 0 86.016-42.3936 86.016-94.72V385.6384c0-52.3264-38.5536-94.7712-86.016-94.7712z m-399.5648-0.768h304.6912V50.176h-304.64v239.8208z m442.112 640.6656c0 25.856-19.0464 46.8992-42.496 46.8992H264.704c-23.4496 0-42.496-20.992-42.496-46.8992V386.9696c0-25.9072 19.0464-46.9504 42.496-46.9504h493.9264c23.5008 0 42.5472 21.0432 42.5472 46.8992v543.7952z"
					 p-id="2900"></path>
					<path d="M447.232 193.3824h132.1472V145.408h-132.096zM688.9472 439.9616c-12.1344 0-21.9648 10.8032-21.9648 24.1664v373.6576c0 13.4144 9.8304 24.2176 22.016 24.2176 12.0832 0 21.9136-10.8032 21.9136-24.2176V464.128c0-13.312-9.8304-24.1664-21.9648-24.1664"
					 p-id="2901"></path>
				</svg>
			</g>


		</svg>
		<!-- ICONS -->

		<div style="min-width:1024px; position:relative;">
			<div class="topbg">
				<iframe id="fancybox-frame" name="fancybox-frame1541658771980" frameborder="0" scrolling="no" hspace="0" src="http://i.tianqi.com/index.php?c=code&a=getcode&id=12&h=50&w=220&color=%23FFFFFF&icon=1&num=1&site=12"
				 class="tianqi"></iframe>
				<div class="logo"><img src="images/logo.png" width="60" height="60">
					<h1>阜康市用能权管理平台</h1>
					<p>Fukang city energy management platform</p>
				</div>

			</div>

			<div id="wrapper">

				<div id="left-side">
					<ul>
						<li class="choose active">
							<div class="icon active">
								<svg viewBox="0 0 32 32">
									<g filter="">
										<use xlink:href="#shopping-cart"></use>
									</g>
								</svg>
							</div>
							普通登录
						</li>
						<!-- <li class="pay">
			<div class="icon">
			  <svg viewBox="0 0 32 32">
				<g filter="">
				  <use xlink:href="#credit-card"></use>
				</g>
			  </svg>
			</div>
			UKey登录
		  </li>	  -->
					</ul>
				</div>

				<div id="border">
					<!-- <div id="line" class="one"></div> -->
				</div>

				<div id="right-side">
					<div id="first" class="active">
						<div class="z-loginError j-loginError pa none"></div>
						<!--提示位置 none隐藏状态-->
						<h1>普通登录</h1>
						<label>
							<b class="z-bUsername pa"></b>
							<input placeholder="请输入您的用户名" autocomplete="off" type="text" name="username" class="z-inputUsername " />
						</label>
						<label>
							<b class="z-bPsw pa"></b>
							<input placeholder="请输入您的密码" type="password" class="z-inputUsername" name="password" />
						</label>
						<label style="width:280px; font-size:14px;"><input type="checkbox" class="jzmm">记住用户</label>
						<button class="z-loginBtn" type="button" />登 录</button>
					</div>
					<!-- <div id="second">
        	<div class="z-loginError j-loginError pa none"></div> -->
					<!--提示位置 none隐藏状态-->
					<!-- 	<h1>UKey登录</h1>
            <label>
                
                <select class="z-select" >
                <option value ="xuanze">请选择密钥</option>
                <option value ="saab">Saab</option>
                <option value="opel">Opel</option>
                <option value="audi">Audi</option>
                </select>
            </label>
            <label>
            	<b class="z-bPsw pa"></b>
            	<input placeholder="请输入ukey码" type="text" class="z-inputUsername" name="password"/>
           </label>
        	<button class="z-loginBtn"  type="button" >登 录</button>
		  
		</div> -->


				</div>
			</div>

			<div class="bottom">
				<img src="images/cloud.png">
				<!-- <p>&copy;版权所有：xxxxxx ｜ 技术支持：xxxxxx</p> -->
			</div>
		</div>
		<script src="js/jquery-1.8.2.min.js"></script>

		<script>
			$('.choose').click(function() {
				$('.choose').addClass('active');
				$('.choose > .icon').addClass('active');
				$('.pay').removeClass('active');
				$('.wrap').removeClass('active');
				$('.ship').removeClass('active');
				$('.pay > .icon').removeClass('active');
				$('.wrap > .icon').removeClass('active');
				$('.ship > .icon').removeClass('active');
				$('#line').addClass('one');
				$('#line').removeClass('two');
				$('#line').removeClass('three');
				$('#line').removeClass('four');
			});
			$('.pay').click(function() {
				$('.pay').addClass('active');
				$('.pay > .icon').addClass('active');
				$('.choose').removeClass('active');
				$('.wrap').removeClass('active');
				$('.ship').removeClass('active');
				$('.choose > .icon').removeClass('active');
				$('.wrap > .icon').removeClass('active');
				$('.ship > .icon').removeClass('active');
				$('#line').addClass('two');
				$('#line').removeClass('one');
				$('#line').removeClass('three');
				$('#line').removeClass('four');
			});
			$('.wrap').click(function() {
				$('.wrap').addClass('active');
				$('.wrap > .icon').addClass('active');
				$('.pay').removeClass('active');
				$('.choose').removeClass('active');
				$('.ship').removeClass('active');
				$('.pay > .icon').removeClass('active');
				$('.choose > .icon').removeClass('active');
				$('.ship > .icon').removeClass('active');
				$('#line').addClass('three');
				$('#line').removeClass('two');
				$('#line').removeClass('one');
				$('#line').removeClass('four');
			});
			$('.ship').click(function() {
				$('.ship').addClass('active');
				$('.ship > .icon').addClass('active');
				$('.pay').removeClass('active');
				$('.wrap').removeClass('active');
				$('.choose').removeClass('active');
				$('.pay > .icon').removeClass('active');
				$('.wrap > .icon').removeClass('active');
				$('.choose > .icon').removeClass('active');
				$('#line').addClass('four');
				$('#line').removeClass('two');
				$('#line').removeClass('three');
				$('#line').removeClass('one');
			});
			$('.choose').click(function() {
				$('#first').addClass('active');
				$('#second').removeClass('active');
				$('#third').removeClass('active');
				$('#fourth').removeClass('active');
			});
			$('.pay').click(function() {
				$('#first').removeClass('active');
				$('#second').addClass('active');
				$('#third').removeClass('active');
				$('#fourth').removeClass('active');
			});
			$('.wrap').click(function() {
				$('#first').removeClass('active');
				$('#second').removeClass('active');
				$('#third').addClass('active');
				$('#fourth').removeClass('active');
			});
			$('.ship').click(function() {
				$('#first').removeClass('active');
				$('#second').removeClass('active');
				$('#third').removeClass('active');
				$('#fourth').addClass('active');
			});
		</script>
		<script type="text/javascript" src="js/login-z.js"></script>

	</body>
</html>
